import React, { useEffect, useRef, useState } from 'react';
import { Calendar,Row, Col } from 'antd';
import styles from "./calendar.module.less"
import moment from 'moment'; 
export const CalendarCard = () => {
    let [date, setDate] = useState(moment().format('YYYY-MM-DD HH:mm:ss'))
    function onPanelChange(value, mode) {
        console.log(value, mode);
    }
    useEffect(()=>{
        setTimeout(()=>{
            setDate(moment().format('YYYY-MM-DD HH:mm:ss'))
        },1000)
    }, [date])
    return (
        <div className={styles.container} >
            <Calendar
                className={styles.calendar}
                fullscreen={false}
                onPanelChange={onPanelChange}
                headerRender={() => <>{date}</>}
                // dateCellRender={() => (
                //     <Row gutter={14}>
                //         <Col span={6}>Sum</Col>
                //         <Col span={6}>Sum</Col>
                //         <Col span={6}>Sum</Col>
                //         <Col span={6}>Sum</Col>
                //         <Col span={6}>Sum</Col>
                //         <Col span={6}>Sum</Col>
                //     </Row>
                // )}
            />
        </div>
    )
}
